<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
</head>

<body>

    <p>局部变量计数。</p>
    <button type="button" onclick="myFunction()">计数!</button>
    <p id="demo">0</p>
    
    <script>
        /* 
            1. 变量 add 指定了函数自我调用的返回字值。
            2. 自我调用函数只执行一次。设置计数器为 0。并返回函数表达式。
            3. add变量可以作为一个函数使用。非常棒的部分是它可以访问函数上一层作用域的计数器。
            4. 这个叫作 JavaScript 闭包。它使得函数拥有私有变量变成可能。
            5. 计数器受匿名函数的作用域保护，只能通过 add 方法修改。
        */
        var add = (function () {
            var counter = 0;
            return function () { return counter += 1; }
        })();
        function myFunction() {
            document.getElementById("demo").innerHTML = add();
        }
    </script>

</body>

</html>